<script setup>
import router from "../../../../router/index.js";
import {RULE} from "../../../../const/index.js";
import {onMounted, reactive, ref} from "vue";
import MyNav from "../../../../components/MyNav.vue";
import MyForm from "../../../../components/MyForm.vue";
import {simpleListApi, updateApi} from "../../../../util/axios.js";
import {getResponseData} from "../../../../util/request.js";
import {isNotNull} from "../../../../util/index.js";

// 获取当前秒杀详情记录
let seckillDetail = JSON.parse(sessionStorage.getItem('row'));
// 所属秒杀活动ID和秒杀活动标题
let seckillId = sessionStorage.getItem('seckillId');
let seckillTitle = sessionStorage.getItem('seckillTitle');

/* ==================== 页面常量 ==================== */

// 路径导航
const navItems = [
  {icon: 'Goods', label: '营销管理'},
  {icon: 'Stopwatch', label: '秒杀列表', url: '/Seckill'},
  {icon: 'Stopwatch', label: `《${seckillTitle}》活动详情`, url: '/SeckillDetail'},
  {icon: 'Edit', label: '修改秒杀详情'},
];

/* ==================== 全查课程 ==================== */

let courseOptions = ref([]);

/** 全查课程 */
async function listCourse() {
  courseOptions.value = [];
  let res = await simpleListApi(null, {module: 'course'});
  let data = getResponseData(res);
  if (isNotNull(data)) {
    data.forEach((item) => {
      let course = {};
      course['label'] = item['title'] + '（￥' + item['price'] + '）';
      course['value'] = item['id'];
      courseOptions.value.push(course);
    });
  }
}

/* ==================== 修改表单 ==================== */

// 表单项 + 表单值 + 表单规则
let items = ref([
  {label: '所属活动', prop: 'seckillTitle', disabled: true, span: 12},
  {
    label: '活动课程', prop: 'fkCourseId', required: true, span: 12,
    type: 'select', options: courseOptions, placeholder: '请选择课程'
  },
  {label: '秒杀价格', prop: 'skPrice', type: 'number', min: 1, required: true, span: 12},
  {label: '秒杀数量', prop: 'skCount', type: 'number', min: 1, required: true, span: 12},
  {label: '秒杀描述', prop: 'info', type: 'textarea'},
]);
let data = reactive(seckillDetail);
let rules = {info: RULE.COMMON_INFO};

/**
 * 修改成功后调用
 * 1. 路由到 SeckillDetail 页面
 */
function updateSuccess() {
  router.push('/SeckillDetail');
}

/* ==================== 加载函数 ==================== */

onMounted(() => listCourse());

</script>

<template>
  <my-nav :items="navItems"/>
  <el-divider/>
  <el-card class="sub-seckill-detail-update-card" header="修改秒杀详情信息">
    <my-form type="update"
             :items="items"
             :rules="rules"
             :api="updateApi"
             :params="data"
             :args="{module: 'seckillDetail'}"
             :callback="updateSuccess"/>
  </el-card>
</template>

<style scoped lang="scss">
.sub-seckill-detail-update-card {
  width: 90%; // 宽度
  margin: 20px auto 0; // 外边距
}
</style>